<template lang="html">
  <div class="leftHeaderWrapper">
    <div class="leftHeader">

      <div style="width:30px; height:30px; border-radius:15px; background-color:#8ba9b4; align-items:center; justify-content:center;">
        <image :src="imageUrl" resize="contain" style="width:18px; height:18px;" ></image>
      </div>


      <text style="font-weight:bold; font-size:30px; margin:5px;">{{title}}</text>
      <div style="height:2px; background-color:#8ba9b4; flex:1;"></div>
      <div style="width:8px; height:8px;background-color:#8ba9b4; border-radius:4px;"></div>
    </div>

    <slot> 暂无 </slot>

  </div>

</template>

<script>
export default {
  props: {
    title:{default:'基本信息'}
  },
  computed: {

    imageUrl: function () {
      return this.getFullImagePath(this.title + ".png");
    }
  }
}
</script>

<style lang="css" scoped>
.leftHeaderWrapper {
  padding-bottom: 30px;
}

.leftHeader {
  flex-direction: row;
  align-items: center;
}
</style>
